// 引入webpack
var webpack = require('webpack');
// 引入刚刚安装的插件
var ExtractTextPlugin = require('extract-text-webpack-plugin');
// Create multiple instances
var extractCSS = new ExtractTextPlugin('css/index.css');
// 引入html-webpack-plugin插件
const HtmlWebpackPlugin = require('html-webpack-plugin');
// 引入uglifyjs-webpack-plugin插件
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');

module.exports = {
    // 测试第二种方式，CDN方式引入jQuery
    // entry : __dirname + '/src/js/index.js', // 唯一入口文件
    // 第一种方式，本地模块引入jQuery
    entry : {
        app : __dirname + '/src/js/index.js',
        more : [__dirname + '/src/js/a.js' , __dirname + '/src/js/b.js'],
        v : ['jquery']
    },
    output : {
        path : __dirname + '/assets/',
        filename : 'js/[name].js'
        // publicPath : '/assets/'  // 公共存放点（temp内存）
    },
    devServer : {
        contentBase : "./",  // 当前项目根目录
        host : '10.10.29.186', // 本机IP地址
        port : '2222' // 端口号
    },
    // 配置模块载入器
    module : {
        loaders : [
            {
                test : /\.css$/, // 正则方式
                loader : 'style-loader!css-loader' // ! 来进行链接
            },
            {
                test : /\.less$/,
                loader : 'style!css!less'
            },
            {
                test : /\.json$/,
                loader : 'json-loader'
            },
            {
                test : /\.js$/,
                exclude : /node_modules/,
                loader : 'babel',
                query : {
                    presets : ['es2015','react']
                }
            }
            // {
            //     test : /\.png|.jpg$/,
            //     loader : 'url-loader?limit=8000&name=../images/[hash:8].[name].[ext]'
            // }
        ],
        rules: [
            {
                test: /\.css$/,
                use: extractCSS.extract({
                    fallback: "style-loader",
                    use: "css-loader"
                })
            },
            // {
            //     test: /\.(png|jpg|gif)$/,
            //     use: [
            //         {
            //             loader: 'url-loader',
            //             options: {
            //                 limit: 8192,
            //                 name: 'images/[hash:8][name].[ext]'
            //             }
            //         }
            //     ]
            // }
            {
                test: /\.(png|jpg|gif)$/,
                use: [
                    {
                        loader: 'file-loader',
                        options: {
                            limit: 8192,
                            name: '[path][name].[ext]'
                        }
                    }
                ]
            }
        ]
    },
    plugins : [
        extractCSS,
        new HtmlWebpackPlugin({
            title: 'Sy App',
            filename: '../home.html',
            template : __dirname + '/src/tpl/index.html',
            inject : 'body',
            info : 'Hello World'
        }),
        new UglifyJsPlugin(),
        // 第一种方式，本地模块引入jQuery
        new webpack.ProvidePlugin({
            $ : 'jquery'
        }),
        // 第一种方式，本地模块引入jQuery
        // new webpack.optimize.CommonsChunkPlugin({
        //     name: "v",
        //     // ( 公共chunk(commnons chunk) 的名称)
        //
        //     filename: "lib/jquery.min.js"
        //     // ( 公共chunk 的文件名)
        //
        //     // minChunks: 3,
        //     // (模块必须被3个 入口chunk 共享)
        //
        //     // chunks: ["pageA", "pageB"],
        //     // (只使用这些 入口chunk)
        // })
        new webpack.optimize.CommonsChunkPlugin({
            names : ['a' , 'b']
        })
    ],
    // 测试第二种方式，CDN方式引入jQuery
    // externals : {
    //   jquery : 'http://libs.baidu.com/jquery/2.0.0/jquery.min.js'
    // },
    watch : true,
    // resolve : {
    //     root : 'F:/Projects/WebstormProjects/packManageTool/js/',
    //     extensions : ['.js'],
    //     alias : {
    //         appAdd : 'add.js'
    //     }
    // }
    resolve : {
        alias : {
            appAdd : 'F:/Projects/WebstormProjects/packManageTool/js/add.js'
        }
    }
};